<template>
	<view class="">
		<u-navbar title="搜索" bgColor="#fff" :autoBack="true"></u-navbar>
		<view class="dis_flex ml24 mr30 h104 fz" :style="{ marginTop: statusHeight }">
			<view class="radius50 h64 dis_f" style="width: 610rpx;background-color: #F7F7F7">
				<u--input
					placeholder="请输入关键字"
					placeholderStyle="color:#999999"
					prefixIcon="search"
					border="none"
					v-model="search"
					prefixIconStyle="font-size: 22px;color: #D1D2D5;margin-left:30rpx"
				></u--input>
			</view>
			<view class="fz28 lh10 ml30" @click="searchPro">搜索</view>
		</view>
		<view class="border_b3 w">
			
		</view>
		<view v-if="store_list.length==0" class="ml30 mr30  mt60">
			<view class="dis_flex">
				<view class="fz26 tf_33 fw">
					最近搜索
				</view>
				<image @click="delSearch" src="../../static/image/search_del.png" class="w24 h24" mode="aspectFill"></image>
			</view>
			<view class="mt24"  >
					<text class="bac_f7 pl24 pr24 bz pt12 pb12 fz28 tf_33 tac radius8 margin10"  v-for="(v,i) in search_list" :key="i">
						{{v}}
					</text>
			</view>
		</view>
		<view class="pt30 ml30 mr30 pb20 border_b3" v-for="(item,index) in store_list" :key="index" @click="goStoreDetail(item)">
			<view class="df">
				<image class="w120 h120 radius8" :src="item.image" mode="aspectFill"></image>
				<view class="ml24 dfd_c jcsb" style="min-width: 546rpx; min-height:60rpx">
					<view class="fz28 tf_333">
						{{item.name}}
					</view>
					<view class="dis_flex w">
						<view class="fz34 fw tf1">
							¥{{item.price}}
						</view>
						<view class="fz24 tf_999">
							销量：{{item.sales_volume}}
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {  getStorelist } from '@/config/api.js';
export default {
	data() {
		return {
			statusHeight:'',
			search:'',
			store_list:[],
			search_list:[],
		};
	},
	onLoad() {
		let res = wx.getSystemInfoSync();
		this.statusHeight = res.statusBarHeight + 50 + 'px';
		console.log(this.store_list);
		if(uni.getStorageSync('search')){
			this.search_list = uni.getStorageSync('search')
		}else{
			this.search_list= []
		}
	},
	methods: {
		//删除最近的记录
		delSearch(){
			uni.removeStorageSync('search')
			this.search_list = []
		},
		//跳转商品详情
		goStoreDetail(e){
			uni.navigateTo({
				url:'/page_store/storeDetail/storeDetail?id=' + e.id
			})
		},
		//搜索
		searchPro(){
			getStorelist({name:this.search}).then(res => {
				console.log(res);
				this.store_list = res.list;
			});
			console.log(this.search_list);
			this.search_list.push(this.search)
			uni.setStorageSync("search",this.search_list)
			this.search = ''
		}
	}
};
</script>

<style>
page {
	background-color: #fff;
}
</style>
